<#ftl output_format="HTML" >
<#import "/layout.ftl" as layout>
<#import "/page.ftl" as pageTemplate>
<@layout.masterTemplate navIndex=2 >
<div class="card mt-4 mb-4" >
    <form id="queryForm" class="card-body">
        <div class="form-inline mb-2">
            <div class="form-group">
                <label for="category" class="sr-only" >栏目：</label>
                <@spring.formSingleSelectWithAll "form.categoryId" allCategories 'class="form-control mr-2"' />
            </div>
            <div class="form-group">
                <label for="title" class="sr-only">标题：</label>
                <@spring.formInput "form.title" 'class="form-control mr-2" style="width:20em" maxlength="20" placeholder="标题" autofocus' 'search' />
            </div>
            <div class="form-group">
                <label for="keyword" class="sr-only">关键字：</label>
                <@spring.formInput "form.keyword" 'class="form-control mr-2" style="width:20em" maxlength="40" placeholder="关键字"' 'search' />
            </div>
        </div>
        <div class="form-inline mb-2">
            <div class="form-group">
                <label for="updater" class="sr-only">修改人：</label>
                <@spring.formInput "form.updater" 'class="form-control mr-2" placeholder="修改人"' />
            </div>
            <div class="form-group">
                <label for="startDate" class="sr-only">修改日期：</label>
                <@spring.formInputDate "form.startDate" 'class="form-control" placeholder="起始日期"' />
                <span class="input-group-text" > - </span>
                <@spring.formInputDate "form.endDate" 'class="form-control mr-2" placeholder="终止日期"' />
            </div>
            <div class="form-group">
                <button type="submit" id="query" class="btn btn-primary">查询</button>
            </div>
        </div>
        <div class="form-inline">
            <div class="form-group">
                <button type="submit" id="query" class="btn btn-primary mr-2">查询</button>
                <button type="button" id="create" class="btn btn-info mr-2">创建</button>
                <button type="button" id="publish" class="btn btn-info mr-2">发布</button>
                <button type="button" id="revoke" class="btn btn-info mr-2">撤回</button>
                <button type="button" id="setSticky" class="btn btn-info mr-2">置顶</button>
                <button type="button" id="unsetSticky" class="btn btn-info mr-2">取消置顶</button>
                <button type="button" id="delete" class="btn btn-warning mr-2">删除</button>
            </div>
        </div>
    </form>
</div>
<div class="table-responsive" >
<table class="as-table table table-hover table-striped table-condensed">
<tr>
    <th class="text-right">ID</th>
    <th class="text-center">类型</th>
    <th class="text-center">标题</th>
    <th class="text-center">修改人</th>
    <th class="text-center">修改时间</th>
    <th class="text-center">置顶</th>
    <th class="text-center">星标</th>
    <th class="text-center">状态</th>
</tr>
<#list notices as notice>
<tr id="r${notice.id}">
    <td class="text-right"><label for="cb${notice.id}" ><input type="checkbox" name="noticeSel" value="${notice.id}" id="cb${notice.id}" data-id="${notice.id}" />&nbsp;${notice.id}</label></td>
    <td class="text-center">
<#if notice.category??>
    ${notice.category.title!""}
</#if>
    </td>
    <td class="text-center"><a href="<@spring.url '/notice/${notice.id}'/>" data-tooltip="${notice.title?js_string}" style="max-width:24em" class="as-literal" >${notice.title}</a></td>
    <td class="text-center">${notice.updater}</td>
    <td class="text-center">${notice.lastModifiedTime?datetime}</td>
    <td class="text-center">
<#if notice.stickTime??>
        <svg class="text-success" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
          <path fill-rule="evenodd" d="M4.5 2a.5.5 0 0 0-.5.5v11.066l4-2.667 4 2.667V8.5a.5.5 0 0 1 1 0v6.934l-5-3.333-5 3.333V2.5A1.5 1.5 0 0 1 4.5 1h4a.5.5 0 0 1 0 1h-4z" clip-rule="evenodd"/>
          <path fill-rule="evenodd" d="M15.854 2.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 0 1 .708-.708L12.5 4.793l2.646-2.647a.5.5 0 0 1 .708 0z" clip-rule="evenodd"/>
        </svg>
</#if>
    </td>
    <td class="text-center">
<#if notice.star>
    <svg class="text-danger" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
      <path fill-rule="evenodd" d="M3.5 1a.5.5 0 0 1 .5.5v13a.5.5 0 0 1-1 0v-13a.5.5 0 0 1 .5-.5z" clip-rule="evenodd"/>
      <path fill-rule="evenodd" d="M3.762 2.558C4.735 1.909 5.348 1.5 6.5 1.5c.653 0 1.139.325 1.495.562l.032.022c.391.26.646.416.973.416.168 0 .356-.042.587-.126a8.89 8.89 0 0 0 .593-.25c.058-.027.117-.053.18-.08.57-.255 1.278-.544 2.14-.544a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-.5.5c-.638 0-1.18.21-1.734.457l-.159.07c-.22.1-.453.205-.678.287A2.719 2.719 0 0 1 9 9.5c-.653 0-1.139-.325-1.495-.562l-.032-.022c-.391-.26-.646-.416-.973-.416-.833 0-1.218.246-2.223.916A.5.5 0 0 1 3.5 9V3a.5.5 0 0 1 .223-.416l.04-.026z" clip-rule="evenodd"/>
    </svg>
</#if>
    </td>
    <td class="text-center">
<#if notice.status == 0>
        <span class="badge badge-secondary">草稿</span>
<#elseif notice.status == 1>
        <span class="badge badge-info">待审核</span>
<#elseif notice.status == 2>
        <span class="badge badge-success">审核通过</span>
<#elseif notice.status == 3>
        <span class="badge badge-light">已撤回</span>
<#else>
        <span class="badge badge-warning">(${notice.status})</span>
</#if>
    </td>
</tr>
</#list>
</table>
</div>
<@pageTemplate.page startRowIndex=page.startRowIndex maximumRows=20 totalCount=noticeCount />
<script type="text/javascript">
'use strict';
let baseUrl = '<@spring.url "/notice" />';
$('#queryForm').submit(evt => {
    let newUrl = baseUrl + '/index(' + combineArgs(['categoryId', 'title', 'keyword', 'updater', 'startDate', 'endDate']) + ')';
    location.href = newUrl + '?_t=' + new Date().getTime();
    evt.preventDefault();
});
$('#create').click(evt => {
    location.href = baseUrl + '/create';
});
$('#publish').click(evt => {
    let selection = getSelectionByName('noticeSel');
    let btn = this;
    if (selection.length > 0) {
        let idArray = selection.join(',');
        if (confirm('确认发布公告【' + idArray + '】？之后还可以撤回')) {
            btn.disabled = true;

            let url = baseUrl + '/publication/' + selection.join(',');
            rpcPut({url: url})
            .then(data => {
                reloadPage(true);
            }).catch((xhr, status, err) => {
                console.error(xhr.responseText);
            }).then(function() {
                btn.disabled = false;
            });
        }
    }
});
$('#revoke').click(evt => {
    let selection = getSelectionByName('noticeSel');
    let btn = this;
    if (selection.length > 0) {
        let idArray = selection.join(',');
        if (confirm('确认撤回公告【' + idArray + '】？之后还可以重新发布')) {
            btn.disabled = true;

            let url = baseUrl + '/revoke/' + selection.join(',');
            rpcDelete({url: url})
            .then(data => {
                reloadPage(true);
            }).catch((xhr, status, err) => {
                console.error(xhr.responseText);
            }).then(function() {
                btn.disabled = false;
            });
        }
    }
});
$('#setSticky').click(evt => {
    let selection = getSelectionByName('noticeSel');
    let btn = this;
    if (selection.length > 0) {
        let idArray = selection.join(',');
        if (confirm('确认置顶公告【' + idArray + '】？之后还可以取消置顶')) {
            btn.disabled = true;

            let url = baseUrl + '/sticky/' + selection.join(',');
            rpcPut({url: url})
            .then(() => reloadPage(true))
            .finally(() => btn.disabled = false);
        }
    }
});
$('#unsetSticky').click(evt => {
    let selection = getSelectionByName('noticeSel');
    let btn = this;
    if (selection.length > 0) {
        let idArray = selection.join(',');
        if (confirm('确认取消置顶公告【' + idArray + '】？之后还可以重新置顶')) {
            btn.disabled = true;

            let url = baseUrl + '/sticky/' + selection.join(',');
            rpcDelete({url: url})
            .then(() => reloadPage(true))
            .finally(() => btn.disabled = false);
        }
    }
});
$('#delete').click(evt => {
    let selection = getSelectionByName('noticeSel');
    let btn = this;
    if (selection.length > 0) {
        let idArray = selection.join(',');
        if (confirm('确认删除公告【' + idArray + '】？此操作无法撤销！')) {
            btn.disabled = true;

            let url = baseUrl + '/' + selection.join(',');
            rpcDelete({url: url})
            .then(() => reloadPage(true))
            .finally(() => btn.disabled = false);
        }
    }
});
</script>
</@layout.masterTemplate>
